<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>

<body>
  <!-- weakMap和weakSet -->
  <!-- 
        1）弱引用，防止内存泄露
        2）WeakMap中只能使用对象作为key, WeakSet中存储的数据只能是对象
        3）没有forEach,size。只能add,delete,has
   -->

  <!-- <script>
    // 对象中存储的是键值对
    // map中的存储的也是键值地
    let a = {};
    function fn(){
      // obj引用了堆空间
      // 引用计数
      let obj = {name:"wc"};
      a.obj = obj; // 强引用
    }
    fn();
    console.log(a);
  </script> -->

  <!-- <script>
    // weakMap也是一个容器，能不能遍历，能不能获取容器中元素的个数？
    // 答：不能，因为它是弱引用，至于什么时候回收，你是不知道。
    //     能add delete  has 
    let wMap = new WeakMap();
    // weakMap中只能存储键值对
    // 并且键只能是对象
    // 弱引用，防止内存泄露
    // 垃圾回收不是立即回收的
    function fn() {
      let obj = { name: "wc" };
      wMap.set(obj, "name info")
    }
    fn();
    setTimeout(() => {
      console.log(wMap);
    }, 2000);
  </script> -->

  <!-- <script>
    let wMap = new WeakMap();
    // WeakMap场景
    let userInfo = {name:"wc"};
    let cityInfo = {city:"bj"};
    // userInfo.city = cityInfo; 强引用
    wMap.set(userInfo,cityInfo); // 让userInfo和cityInfo建立了一种关系，通过userInfo就可以得到cityInfo，并且让它们彼此之间是独立的，而且不影响彼此的销毁逻辑
  </script> -->

  <!-- WeakSet: 
        1）弱引用，防止内存泄露，只能用对象作为里面的元素
        2）没有forEach,size。只能has,delete,add 
  -->
  <script>
    let set = new Set();
    function fn() {
      let obj = { name: "wc" };
      set.add(obj)
    }
    fn();
    setTimeout(() => {
      console.log(set);
    }, 2000)
  </script>

  <script>
    console.log("------------");

    let wSet = new WeakSet();
    function fn() {
      let obj = { name: "wc" };
      wSet.add(obj)
    }
    fn();
    setTimeout(() => {
      console.log(wSet);
    }, 2000);
  </script>
</body>

</html>